<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" type="text/css" href="styleFactures.css" />
</head>
<body>
	<div id="tout">


		<div id="header">
			<label style="font-size: 50px" id="espFamille">Espace famille</label>
			<div id="headerDroite">
				<h:form>
					<h:panelGrid columns="2">
						<h:outputText style="center:left" value="#{mbConnexion.leLogin}" />
						<h:commandButton value="Déconnexion"
							action="#{mbConnexion.deconnexion}" />
						<h:outputText style="center:left" />
						<h:outputText style="center:left" />
					</h:panelGrid>
				</h:form>
			</div>



		</div>
		<div style="clear: both;"></div>
		<div id="photo">
			<img src="autreImages/classess.jpg" alt="photo" /> <img
				src="autreImages/vignette_passeport.jpg" alt="photo" /> <img
				src="autreImages/vignette_rencontre_jeunesse.jpg" alt="photo" />
			<div id="dernierePhoto">
				<img src="autreImages/vignette_vivre.jpg" alt="photo" />
			</div>
		</div>
		<div id="content">
			<ul id="menu">

				<li><a href="accueil.xhtml">Accueil</a></li>
				<li><a href="ficheEnfant.xhtml">Ma Fiche Enfant</a></li>
				<li><a href="Consulterinscriptions.xhtml">Mes Inscriptions</a>
					<ul>
						<li><a href="inscriptions.xhtml">Inscrire/Modifier</a></li>
						<li><a href="Consulterinscriptions.xhtml">Consulter
								activités</a></li>
					</ul></li>
				<li><a href="factures.xhtml">Mes Factures</a></li>
				<li><a href="contact.xhtml">Contact</a></li>
			</ul>
			<div id="milieux">
				<div id="centre">
					<fieldset id="infoPaiement">
						<legend>
							<b>Paiements</b>
						</legend>
						<table>

							<tr>
								<td><span>Pays</span></td>
								<td><select>
										<option>France</option>
										<option>Suede</option>
										<option>Italie</option>
										<option>Algerie</option>
										<option>Tunisie</option>
								</select></td>
							</tr>
							<tr>

								<td><span>Type de paiement</span></td>
								<td>
									<table>
										<tr>

											<td><input type="radio" name="typeP" value="cb" /></td>
											<td><img src="images/cb.png" alt="photo CB" /></td>
											<td><span>Carte bancaire</span></td>

										</tr>

										<tr>
											<td><input type="radio" name="typeP" value="cb" /></td>
											<td><img src="images/visa.png" alt="photo visa" /></td>
											<td><span>Visa</span></td>
										</tr>


										<tr>
											<td><input type="radio" name="typeP" value="cb" /></td>
											<td><img src="images/mastercard.png"
												alt="photo mastercard" /></td>
											<td><span>MasterCard</span></td>
										</tr>

									</table>
								</td>
							</tr>

							<tr>
								<td>Numero de carte</td>
								<td><input type="text" name="numCarte" /></td>
							</tr>
							<tr>
								<td>Date d expiration</td>
								<td><input type="text" name="expirationM" /></td>
							</tr>

							<tr>
								<td>Cryptogramme visuel</td>
								<td><input type="text" name="Crypto" /></td>
							</tr>
							<tr>
							<h:form>
								<td><h:commandButton id="btnpayer" style="margin-top:15px;margin-left: 80px;" value="Payer" action="factures" /></td>
								<td><h:commandButton id="btnannuler" style="margin-top:15px;margin-left: 40px;" value="Annuler" action="factures.xhtml" />
								</td></h:form>
							</tr>
						</table>
					</fieldset>
				</div>
				<div style="clear: both;"></div>
			</div>
		</div>
		<div style="clear: both;"></div>
		<div id="footer">
			<img src="images/afcepfMinus.png"></img> Gepeto <img
				src="images/malakoffMinus.png" />
		</div>
	</div>
</body>
</html>
